<template>
  <view class="reparilTask">
    <view>
      <view class="buildingBox">
        <view class="buildingContent">
          <view class="top">
            <image src="@/static/images/index/buildIcon.svg" mode="" />
            <view class="buildingName"> {{ msg.buildingName }} </view>
            <text>{{ msg.elevatorTotal || msg.elevatorList.length }}</text>
          </view>
          <view class="address">{{ msg.buildingAddress }}</view>
          <view class="address" v-if="msg.estateCompanyNames != null">{{
            msg.estateCompanyNames
          }}</view>
        </view>
      </view>
      <view v-if="newCard">
        <elevator-card :newCard="newCard" :is-last="index == msg.elevatorList.length - 1"
          v-for="(item, index) in msg.elevatorList" :key="index" :type="type" :msg="item"></elevator-card>
      </view>
      <view v-else-if="cardType == 1">
        <elevator-card :cardType="cardType" :is-last="index == msg.planSimpleInfoDTOS.length - 1"
          v-for="(item, index) in msg.planSimpleInfoDTOS" :key="index" :msg="item"></elevator-card>
      </view>
      <view v-else>
        <elevator-card :cardType="cardType" :is-last="index == msg.elevatorCountVOS.length - 1"
          v-for="(item, index) in msg.elevatorCountVOS" :key="index" :msg="item"></elevator-card>
      </view>
    </view>
  </view>
</template>

<script>
import elevatorCard from './elevatorCard.vue';

export default {
	components: { elevatorCard },
	props: {
		cardType: {
			type: String,
		},
		msg: {
			type: Object,
		},
		newCard: {  // 是否是新卡片样式 用于电梯统计新的电梯详情页 中海
			type: Boolean,
			default: false,
		},
		type:{  // 只限新卡片样式 用于电梯统计新的电梯详情页 中海  只有6的情况(暂停维保电梯总览) 表现为跳转到电梯详情时直接为保养计划tab
			type: [String, Number],
		}
	},
	data() {
		return {};
	},
};
</script>

<style lang="scss" scoped>
.reparilTask {
  width: 710rpx;
  //   height: 716rpx;
  margin-bottom: 16rpx;
  background: #ffffff;
  border-radius: 8rpx;

  .buildingBox {
    border-bottom: 2rpx solid #eee;

    .buildingContent {
      padding: 20rpx;

      .top {
        display: flex;
        font-size: 26rpx;
        color: #333;
        align-items: center;
        margin-bottom: 4rpx;

        image {
          width: 32rpx;
          height: 32rpx;
          margin-right: 8rpx;
        }

        text {
          width: 28rpx;
          height: 28rpx;
          background: #e9e9e9;
          border-radius: 50%;
          display: inline-block;
          text-align: center;
          line-height: 28rpx;
          margin-left: 4rpx;
        }
      }

      .address {
        padding: 0rpx 0 0rpx 40rpx;
        font-size: 24rpx;
        color: #999;
        width: 650rpx;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
      }
    }
  }
}
</style>
